<!DOCTYPE html>  
<html>  
  
<head>  
    <title>更新课程信息</title>  
    <style>  
        body {  
            font-family: Arial, sans-serif;  
            max-width: 400px;  
            margin: 0 auto;  
            padding: 20px;  
            background-color: #f4f4f4;  
        }  
  
        h1 {  
            color: #333;  
        }  
  
        label {  
            display: block;  
            margin: 10px 0;  
            color: #555;  
        }  
  
        input[type="text"] {  
            width: 100%;  
            padding: 10px;  
            margin: 5px 0;  
            box-sizing: border-box;  
        }  
  
        button {  
            background-color: #007bff;  
            color: white;  
            padding: 10px 20px;  
            border: none;  
            cursor: pointer;  
        }  
  
        button:hover {  
            background-color: #0056b3;  
        }  
    </style>  
</head>  
  
<body>  
    <h1>更新课程信息</h1>  
  
    <div>  
        <label for="courseName">课程名称：</label>  
        <input type="text" id="courseName">  
    </div>  
  
    <div>  
        <label for="courseTime">课程学分：</label>  
        <input type="text" id="courseTime">  
    </div>  
  
    <div>  
        <label for="courseLocation">课程学时：</label>  
        <input type="text" id="courseLocation">  
    </div>  
  
    <button onclick="updateCourse()">更新课程</button>  
  
    <script>  
        // 从URL参数中获取课程ID  
        var urlParams = new URLSearchParams(window.location.search);  
        var courseId = urlParams.get('id');  
  
        function updateCourse() {  
            var courseName = document.getElementById('courseName').value;  
            var courseTime = document.getElementById('courseTime').value;  
            var courseLocation = document.getElementById('courseLocation').value;  
  
            var data = {  
                course_name: courseName,  
                course_time: courseTime,  
                course_location: courseLocation  
            };  
  
            var xhr = new XMLHttpRequest();  
            xhr.open('PUT', 'http://localhost:8080/updateCourse/' + courseId, true);  
            xhr.setRequestHeader('Content-Type', 'application/json');  
            xhr.onload = function () {  
                if (xhr.status >= 200 && xhr.status < 300) {  
                    console.log('Course updated successfully');  
                    window.location.href = 'kc'; // 更新成功后跳转回课程列表页面  
                } else {  
                    console.error(xhr.statusText);  
                }  
            };  
            xhr.send(JSON.stringify(data));  
        }  
    </script>  
</body>  
  
</html>